import React, { Component, lazy, Suspense } from 'react';
import { Switch, Route, Redirect, NavLink, Link } from 'react-router-dom';
import { NavBar } from 'antd-mobile'
import '../styles/Register.scss'
var phone = lazy(() => import('./Register/phone'))
var code = lazy(() => import('./Register/code'))
var pass = lazy(() => import('./Register/pass'))
class Register extends Component {
   back(){
    this.props.history.go(-1)
   }
    render() {
        return (
            <div className='register'>
                <div className="fan">
                    <NavBar onBack={()=>{this.back()}}>注册</NavBar>
                </div>
                <Suspense fallback={<div className='loading'><img src="https://tva1.sinaimg.cn/large/006APoFYly1g8mf9qe5udg30jz0jzjtr.gif" alt="" /></div>}>
                     <Switch>
                        <Route exact path="/register/phone" component={phone} />
                        <Route exact path="/register/code" component={code} />
                        <Route exact path="/register/pass" component={pass} />
                        <Redirect  from="/register" to="/register/phone" />
                     </Switch>
                </Suspense>
            </div>
        );
    }
}

export default Register;